<template>
  <el-dialog
    :title="dialog.title"
    :visible.sync="dialog.show"
    width="600px"
    custom-class="mydialog"
    append-to-body
    @close="handleClose"
  >
    <div class="dialog-content">
      <el-form ref="form1" :model="form" :rules="rules" label-width="150px">
        <el-form-item label="出货仓：">{{ dialog.warehouseName }}</el-form-item>
        <el-table :data="tableData" border show-summary style="width: 100%" class="dialog-table">
          <el-table-column prop="skuName" label="商品名称" width="120"/>
          <el-table-column prop="amount" label="商城订单量"/>
          <el-table-column prop="amount1" label="需出货量">
            <template slot-scope="scope">{{ scope.row.amount - scope.row.outAmount }}</template>
          </el-table-column>

          <el-table-column prop="stockAmount" label="库存量"/>
          <el-table-column prop="currentOutAmount" label="此次发货量">
            <template slot-scope="scope">
              <el-input v-model="scope.row.currentOutAmount"/>
            </template>
          </el-table-column>
        </el-table>
        <el-form-item label="物流公司：">
          <el-select v-model="form.type" filterable placeholder="发货方式" class="seach-select" size="small">
            <el-option
              v-for="item in form.type_options"
              :key="item.expressCompanyId"
              :label="item.expressCompanyName"
              :value="item.expressCompanyId"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="物流单号：">
          <el-input v-model="form.number"/>
        </el-form-item>
        <el-form-item label="备注：">
          <el-input v-model="form.remark" type="textarea" style="width:300px;"/>
        </el-form-item>
      </el-form>
      <div class="text-center mt-30">
        <el-button :disabled="btnEnable" class="greenbt" type="primary" @click="send()">确认出货</el-button>
      </div>
    </div>
  </el-dialog>
</template>
<script>
import { getExpressCompanys, confirmShipment } from '@/api/pas/delivery'
export default{
  props: {
    modalStaticData: {
      type: Object,
      default: () => {}
    },
    // 父组件调用时传进来的参数
    modalData: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      dialog: {
        title: '',
        show: true,
        warehouseName: ''
      },
      form: {
        type_options: [],
        type: '',
        number: '',
        remark: ''
      },
      rules: {},
      tableData: [],
      search: {
        shipmentRecord: '',
        expressCompanyId: '',
        expressNumber: '',
        remark: ''
      },
      btnEnable: false
    }
  },
  mounted() {
    // 基本信息
    this.dialog.title = '仓库自发'
    this.tableData = this.modalData
    this.dialog.warehouseName = this.tableData[0].warehouseName
    // 快递公司
    getExpressCompanys().then(response => {
      if (response.data.status === 'success') {
        this.form.type_options = response.data.data.list
      }
    })
  },
  methods: {
    handleClose() {
      this.$emit('close')
    },
    // 发货
    send() {
      if (this.form.type === null || this.form.type === '' || this.form.number === null || this.form.number === '') {
        this.$message('快递信息不能为空！')
        return
      }
      for (var i = 0; i < this.tableData.length; i++) {
        if (this.tableData[i].currentOutAmount === '0' || this.tableData[i].currentOutAmount === null || this.tableData[i].currentOutAmount === '') {
          this.$message('发货量不能为0或空！')
          return
        }
        if (isNaN(this.tableData[i].currentOutAmount)) {
          this.$message('发货量必须是数字！')
          return
        }
        var xc = this.tableData[i].amount * 1 - this.tableData[i].outAmount * 1
        if (parseInt(xc) < parseInt(this.tableData[i].currentOutAmount)) {
          this.$message('发货量不能大于需出货量！')
          return
        }
        if (parseInt(this.tableData[i].currentOutAmount) > parseInt(this.tableData[i].stockAmount)) {
          this.$message('发货量不能大于库存量！')
          return
        }
      }
      this.btnEnable = true
      this.search.shipmentRecord = JSON.stringify(this.tableData)
      this.search.expressCompanyId = this.form.type
      this.search.expressNumber = this.form.number
      this.search.remark = this.form.remark
      confirmShipment(this.search)
        .then(response => {
          if (response.data.status === 'success') {
            this.$message({
              message: response.data.messge
              // type: 'success'
            })
            this.handleClose()
          } else {
            this.btnEnable = false
            this.$message({
              message: response.data.messge,
              type: 'warning'
            })
          }
        }).finally(() => {
          this.modalStaticData.closeChildAndRefresh()
        })
    }

  }
}
</script>
